<template>
    <div class="box">
        <header> <van-nav-bar title="选择地址" left-text="返回" left-arrow @click-left="$router.back()" /></header>
        <div class="content">
            <van-address-list v-model="chosenAddressId" :list="addressList" default-tag-text="默认" @add="onAdd"
                @edit="onEdit" @select="onSelect" />
        </div>
    </div>
</template>
<script>
import { mapState, mapMutations, mapGetters } from 'vuex'
export default {
    data() {
        return {
            chosenAddressId: '1',
        }
    },
    created() {
        // 初始化时，将选中的那条地址的id赋值给初始的chosenAddressId
        this.chosenAddressId = this.defaultAddress.id
    },
    computed: {
        ...mapState(['addressList']),
        ...mapGetters(['defaultAddress'])
    },
    methods: {
        ...mapMutations(['changeisDefault']),
        onAdd() {
            this.$router.push('/order/add')
        },
        onEdit(item, index) {
            this.$router.push(`/order/edit/${item.id}`)
        },
        onSelect(info) {
            // 切换选中的地址时触发	-- 修改addressList中当前点击的这个地址isDefault为true，其他的都设为false
            this.changeisDefault(info.id)
            this.$router.back()
        }
    }
}
</script>